<template>
  <div class="box">
    <my-logo-header v-once></my-logo-header>
    <div class="content">
      <div class="section" v-if="isSuccess">
        <div>
          <i class="iconfont icon-xiaolian1 success-color"></i>
        </div>
        <div>充值成功</div>
        <div>
          <a :href="payUrl">回到首页</a>
          <a class="success-color" @click="toUser">充值结果</a>
        </div>
      </div>
      <div class="section" v-else>
        <div>
          <i class="iconfont icon-kulian-line fail-color"></i>
        </div>
        <div>充值失败</div>
        <!--<div>-->
          <!--<router-link to="/">回到首页</router-link>-->
          <!--<a :href="payUrl" class="success-color">再次充值</a>-->
        <!--</div>-->
      </div>
      <my-order></my-order>
    </div>
    <bottom v-once></bottom>
  </div>
</template>

<script>
  import WeiXinConst from '../utils/WeixinConst.js';
  import {Toast,Indicator} from 'mint-ui';
  import {mapState} from 'vuex';
  import LogoHeader from '../components/LogoHeader.vue';
  import Order from '../components/order/Order.vue';

  export default {
    name: "payStatus",
    created() {
      this.isSuccess = this.$route.query.isSuccess;
      this.payUrl = WeiXinConst.payUrl;
    },
    components: {
      'my-logo-header': LogoHeader,
      'my-order': Order,
    },
    computed: {
      ...mapState(['list','isLoading'])
    },
    watch: {},
    data: function () {
      return {
        isSuccess: false,
        payUrl: ''
      }
    },
    methods:{
      toUser(){
        Indicator.open({
          text: 'Loading...',
          spinnerType: 'fading-circle'
        });
        localStorage.setItem('type','1');
        this.isLoading = false;
        let obj = JSON.parse(localStorage.getItem('package'));
        let form = {
          user_id: obj.user_id,
          place_id: obj.place_id
        };
        this.$store.dispatch('getPlaceInfo',form)
      }
    }
  }
</script>

<style scoped>
  .box {
    height: 100%;
    background-color: #f9f9f9;
  }

  .section {
    height: 1.85rem;
    background-color: #fff;
    text-align: center;
    box-sizing: border-box;
    padding: 0.25rem 0.4rem;
    font-size: 0.18rem;
  }

  .section .iconfont {
    font-size: 0.6rem;
  }

  .section>div:last-child {
    margin-top: 0.1rem;
    font-size: 0.13rem;
  }
  .section>div:last-child>a {
    padding:0 0.2rem;
    text-decoration: none;
  }
  .section>div:last-child>a:first-child {
    border-right: 1px solid #bbbbbb;
  }

</style>
